<template>
<!-- 查询项目评分 -->
  <div class="projectAssess">
     <div class="btnBox">
        <el-button size="mini" type="primary" @click="saveAccessInfo"
          >保 存</el-button>
      </div>
    <div class="headerTitle">
      <span>{{ project.projectName}}</span>
       <span v-if="project.projectStatus == 0">（已创建）</span>
       <span v-if="project.projectStatus == 1">（完成中）</span>
       <span v-if="project.projectStatus == 2">（已完成）</span>
      <span>
        <el-rate v-model="project.projectScore"></el-rate>
      </span>
    </div>
    <!-- 备注 -->
    <div class="remarks">
    <span>备注</span>
      
    <el-input          
          v-model="project.mark"
          type="textarea"
          :autosize="{ minRows: 4, maxRows: 4 }"
          placeholder="请输入内容"
        >
    </el-input>

    </div>
    <div class="personAssess">
      <ul>
        <li v-for="(item, index) in users" :key="index">
          <span>{{ item.name }}</span>
          <span>{{ item.position }}</span>

          <span>
            <el-rate v-model="item.score"></el-rate>
          </span>
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
import {
  ReqListScorePro,
  ReqPersonByProjectId,
  ReqDemandDetailInfoById,
  ReqProjectScore,
  ReqUpdateProjectScore,
} from "../../../request";
  export default {
  data() {
    return {
      project1: 3,
      projectPerson: [],
      currentAccess: {},
      project: {
        mark: "",
        projectId: "",
        projectName: "",
        projectScore: 0,
        projectStatus: 0,
      },
      users: [],
      // 评分id:
      id: "",
    };
  },
  methods: {
    // 获取参与项目的人
    async getProjectPerson() {
      const query = this.$router.history.current.query;
      const resultData = await ReqListScorePro({
        createdId: "1",
        scoredId: query.data.id,
      });
      this.id = resultData?.scoreEntity?.id;
      console.log("resultData", resultData)
      const { scoreEntity } = resultData;
      if (scoreEntity) {
        // console.log(scoreEntity)
        const { scoreDetails } = scoreEntity;
        this.currentAccess = JSON.parse(scoreDetails);
        console.log(this.currentAccess);
        this.project = this.currentAccess.project;
        this.users = this.currentAccess.users;
        console.log(this.currentAccess);
      } else {
        // 根据id获取需求
        const demandData = await ReqDemandDetailInfoById({
          id: query.demandId,
        });
        // console.log(demandData)
        const {
          demandVo: { project },
        } = demandData;

        const personData = await ReqPersonByProjectId({
          projectId: query.projectId,
        });
        const { scoreVo } = personData;
        this.users = scoreVo;
        this.project.projectId = query.projectId;
        this.project.projectName = project.projectName;
        this.project.projectStatus = project.status;
        this.currentAccess = {
          users: this.users,
          project: this.project,
        };
        console.log(this.currentAccess);
      }
    },
    // 保存信息
    async saveAccessInfo() {
      this.currentAccess.project = this.project;
      this.currentAccess.users = this.users;
      if (this.id) {
        const requestData1 = {
          createdId: "1",
          scoreDetails: JSON.stringify(this.currentAccess),
          scoredId: this.project.projectId,
          socreSource: 1001,
          id: this.id,
        };
        const dat = await ReqUpdateProjectScore(requestData1);
        const { msg } = dat;
        if (msg === "success") {
          this.$message.success("评分更改成功");
        }
      } else {
        const requestData = {
          createdId: "1",
          scoreDetails: JSON.stringify(this.currentAccess),
          scoredId: this.project.projectId,
          socreSource: 1001,
        };
        console.log(requestData);
        const resultData = await ReqProjectScore(requestData);
        const { msg } = resultData;
        if (msg == "success") {
          this.$message.success("评分成功");
        }
      }
    },
  },
  async created() {
    await this.getProjectPerson();
  },

};
</script>

<style scoped>
.el-button{
  background-color: rgb(27,147,196);
}
.projectAssess {
  width: 90%;
  margin: 20px auto;
  font-size: 14px;
}
.projectAssess .headerTitle {
  display: flex;
}
.projectAssess .headerTitle > :nth-child(1) {
  flex: 1;
}
.projectAssess .headerTitle > :nth-child(2) {
  flex: 1;
  text-align: left;
}
.projectAssess .headerTitle > :nth-child(3) {
  width: 130px;
}
.remarks {
  margin-top: 30px;
}
.remarks span {
  line-height: 30px;
}
.remarks p {
  color: #aaa;
}
.personAssess {
  margin-top: 50px;
}
.personAssess ul li {
  display: flex;
  line-height: 50px;
  height: 50px;
}
.personAssess ul li > :nth-child(1) {
  flex: 1;
}
.personAssess ul li > :nth-child(2) {
  flex: 1;
}
.personAssess ul li > :nth-child(3) {
  width: 130px;
}
.personAssess ul li > :nth-child(3) .el-rate {
  line-height: 60px;
}
.connectAb {
  height: 50px;
  line-height: 50px;
  display: flex;
  border-bottom: 1px solid #eee;
  border-top: 1px solid #eee;
}
.connectAb span {
  flex: 1;
}
.connectAb > :nth-child(2) {
  text-align: right;
}
.connectAb > :nth-child(2) .el-rate {
  line-height: 60px;
}
.btnBox{
  align-items:right;
  margin-bottom: 10px;
}
</style>
